<template>
    <el-tabs
      type="border-card"
      v-model="activeName"
      @tab-click="handleClick"
      class="left_tree_tap"
    >
      <!-- <div class="sjtj_ts"><i class="el-icon-warning-outline"></i>双击即添加</div> -->
      <el-tab-pane label="指标" name="first" style="padding: 0">
        <el-container>
            <el-header class="height_auto pdbt">
                <el-select v-model="ttId" placeholder="请选择数据源表单" :style="{width: '98%'}" size="mini" class="ttClass">
                  <el-option v-for="(item, index) in ttIdOptions" :key="index" :label="item.label"
                    :value="item.value" :disabled="item.disabled"></el-option>
                </el-select>
              </el-col>
            </el-header>
            <el-main>
              <el-row :gutter="6" class="bk_padding_le_rg">
                <el-col :span="12">
                    <vxe-input
                    id="treeSreach"
                    v-model="searchVal"
                    placeholder="指标名称"
                    type="search"
                    size="mini"
                    prefix-icon="fa fa-sitemap"
                    class="input_bk"
                    @search-click="refresh(searchVal)"
                    @keyup.enter.native="refresh(searchVal)"
                    />
                </el-col>
                <el-col :span="12" style="text-align: right">
                    <el-button type="text" icon="el-icon-refresh" size="mini" @click="refresh">刷新</el-button>
                </el-col>
              </el-row>
              <el-row :gutter="6" class="bk_padding_le_rg">
                <ps-tree ref="tbdwTree" :tree-comp-data="tbdwlTreeData" @createRightMenu="createRightMenu" @refresh="refresh" @onTreeClick="treeClick"/>
              </el-row>     
            </el-main>
        </el-container>
      </el-tab-pane>
      <el-tab-pane label="函数" name="second">
        <function-Selector @funClick="funClick" />
      </el-tab-pane>
    </el-tabs>
  </template>
  <script>
  import request from "@/utils/requestutil";
  import { getRealUrl, syncRequest } from "@/utils/httpRequet";
  import $ from "jquery";
  import treeExhide from "@/components/ztree/lib/jquery.ztree.exhide.min.js";
  import dicPanel from "@/hr/utils/dicPanel";
  import { options } from "runjs";
  import psTree from "@/components/psTree/psTree";
  import { isNull } from "xe-utils/methods";
  import functionSelector from "@/components/FunctionSelector/FunctionSelector";
  export default {
    components: {
      psTree,
      dicPanel,
      functionSelector,
    },
    data() {
      return {
        searchVal:"",
        activeName: "first",//设置第一个tab为选中状态
        ttId: "",
        ttIdOptions: [{
          "label": "选项一",
          "value": 1
        }, {
          "label": "选项二",
          "value": 2
        }],
        tbdwlTreeData:{
            treeConfigKey:"",
            treeBuildConfig:{
                beforeDrop: this.beforeDrop,
                beforeDrag:this.beforeDrag,
                dealTreaparam: this.dealTreaparam,
                dataFilter: this.datafilter,
                beforeDblClick: this.beforeDblClick,
            },
        }
      };
    },
    props: {
      leftTreeData: {
        type: Object,
        default: () => {
          return {};
        },
      },
    },
    watch: {
      leftTreeData: {
        handler(data) {
          this.ywValue = data.ywValue;
          this.rwValue = data.rwValue;
          this.tableID = data.treeID;
          this.$refs.tbdwTree.refresh();
        },
        deep: true,
      },
    },
    methods: {
      //添加按钮事件
      beforeDrop(){
          return false;
      },
      beforeDrag(){
          return false;
      },
      dealTreaparam(treeid, node){
        const _that = this;
        if (node == undefined || node == "") {
            return { p0: "ROOT", p1: "ROOT", p2: "ROOT" };
        }
      },
      datafilter(treeid, pnode, resdata){
          console.log(1111);
        let t = this;
        let tree = [];
        if (resdata && resdata.data && resdata.data.length > 0) {
            t.$_.forEach(resdata.data, (item, val) => {
            if (item.leaf == "0") item.isParent = true;
            });
        } else {
            if (pnode) pnode.isParent = false;
        }
        if (pnode == undefined) {
            //加载根节点

        }
      },
      //指标的双击事件
      beforeDblClick(treeId, treeNode){

      },

      handleClick(){

      },
      //刷新树结构
      refresh(){

      },
      //树节点右击菜单
      createRightMenu(params) {
        params.items = [];
      },
      //树节点的点击事件
      treeClick(){

      },
      //函数的双击事件
      funClick(){

      }
    },
  };
  </script>
  
  <style lang="scss" scoped>
  .select_box {
    width: 100%;
    padding-left: 8px;
  }
  .ttClass{
    padding-left: 2%;
  }
  .align_box {
    align-items: center;
  }
  .align_box .el-aside {
    background: #fff;
  }
  .align_box .el-main {
    overflow: hidden;
  }
  .tabl {
    width: 300px;
  }
  
  .tabl ::v-deep {
    .el-tabs__header {
      margin-bottom: 0px;
      height: 33px;
      .el-tabs__nav-scroll {
        height: 33px;
      }
    }
  }
  </style>
  